<script setup>
import { onMounted } from 'vue';

// beforeCreate和created相关代码
// 1. beforeCreate：在实例初始化之后，数据观测和事件配置之前被调用。
// 2. created：在实例创建完成后被立即调用，此时数据观测和事件配置都已完成，但 DOM 还未挂载到页面上。
const getList = () => {
  console.log('获取数据');
  setTimeout(() => {
    console.log('数据获取完成');
  }, 1000);
};

getList();


// beforeMount和mounted相关代码
// 1. beforeMount：在挂载开始之前被调用，此时模板编译完成，数据观测和事件配置都已完成。
// 2. mounted：在实例挂载到页面上后被立即调用，此时可以访问到 DOM 元素。
onMounted(() => {
  console.log('组件挂载完成 - 逻辑1');

});

onMounted( () => {
  console.log('组件挂载完成 - 逻辑2');
});





</script>

<template>
<div>

</div>
</template>